<!DOCTYPE HTML>
<!-- saved from url=(0065)https://www.17sucai.com/preview/1474877/2018-12-05/erro/demo.html -->
<!DOCTYPE html PUBLIC "" "">
<HTML>
	<HEAD>
		<META content="IE=11.0000" http-equiv="X-UA-Compatible">

		<META charset="utf-8">
		<TITLE>Error</TITLE>
		<STYLE>
			html,
			body {
				height: 100vh
			}

			html:before,
			html:after,
			body:before,
			body:after {
				content: '';
				background: linear-gradient(#203075, #233581);
				border-radius: 50%;
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%)
			}

			html:before,
			body:before {
				background: linear-gradient(#233581, #203075)
			}

			html {
				background: linear-gradient(#203075, #233581);
				overflow: hidden
			}

			html:before {
				height: 105vmax;
				width: 105vmax;
				z-index: -4
			}

			html:after {
				height: 80vmax;
				width: 80vmax;
				z-index: -3
			}

			body {
				display: flex;
				justify-content: center;
				align-items: center;
				color: #FFF;
				font-family: 'Varela Round', Sans-serif;
				text-shadow: 0 30px 10px rgba(0, 0, 0, 0.15)
			}

			body:before {
				height: 60vmax;
				width: 60vmax;
				z-index: -2
			}

			body:after {
				height: 40vmax;
				width: 40vmax;
				z-index: -1
			}

			.main {
				text-align: center;
				z-index: 5
			}

			p {
				font-size: 18px;
				margin-top: 0
			}

			h1 {
				font-size: 145px;
				margin: 0
			}

			button {
				background: linear-gradient(#EC5DC1, #D61A6F);
				padding: 0 12px;
				border: none;
				border-radius: 20px;
				box-shadow: 0 30px 15px rgba(0, 0, 0, 0.15);
				outline: none;
				color: #FFF;
				font: 400 16px/2.5 Nunito, 'Varela Round', Sans-serif;
				text-transform: uppercase;
				cursor: pointer
			}

			.bubble {
				background: linear-gradient(#EC5DC1, #D61A6F);
				border-radius: 50%;
				box-shadow: 0 30px 15px rgba(0, 0, 0, 0.15);
				position: absolute
			}

			.bubble:before,
			.bubble:after {
				content: '';
				background: linear-gradient(#EC5DC1, #D61A6F);
				border-radius: 50%;
				box-shadow: 0 30px 15px rgba(0, 0, 0, 0.15);
				position: absolute
			}

			.bubble:nth-child(1) {
				top: 15vh;
				left: 15vw;
				height: 22vmin;
				width: 22vmin
			}

			.bubble:nth-child(1):before {
				width: 13vmin;
				height: 13vmin;
				bottom: -25vh;
				right: -10vmin
			}

			.bubble:nth-child(2) {
				top: 20vh;
				left: 38vw;
				height: 10vmin;
				width: 10vmin
			}

			.bubble:nth-child(2):before {
				width: 5vmin;
				height: 5vmin;
				bottom: -10vh;
				left: -8vmin
			}

			.bubble:nth-child(3) {
				top: 12vh;
				right: 30vw;
				height: 13vmin;
				width: 13vmin
			}

			.bubble:nth-child(3):before {
				width: 3vmin;
				height: 3vmin;
				bottom: -15vh;
				left: -18vmin;
				z-index: 6
			}

			.bubble:nth-child(4) {
				top: 25vh;
				right: 18vw;
				height: 18vmin;
				width: 18vmin
			}

			.bubble:nth-child(4):before {
				width: 7vmin;
				height: 7vmin;
				bottom: -10vmin;
				left: -15vmin
			}

			.bubble:nth-child(5) {
				top: 60vh;
				right: 18vw;
				height: 28vmin;
				width: 28vmin
			}

			.bubble:nth-child(5):before {
				width: 10vmin;
				height: 10vmin;
				bottom: 5vmin;
				left: -25vmin
			}
		</STYLE>

		<META name="GENERATOR" content="MSHTML 11.00.9600.17842">
	</HEAD>
	<BODY>
		<DIV class="bubble"></DIV>
		<DIV class="bubble"></DIV>
		<DIV class="bubble"></DIV>
		<DIV class="bubble"></DIV>
		<DIV class="bubble"></DIV>
		<DIV class="main">
			<H1>404</H1>
			<P>页面正在建设中！</P>
		</DIV>
	</BODY>
</HTML>
